<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<header>
<title>Light Cloud</title>
	<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=utf-8"/>
	<META HTTP-EQUIV="Pragma" CONTENT="no-cache"/>
	<META HTTP-EQUIV="Expires" CONTENT="0"/>
	<META HTTP-EQUIV="Content-Language" CONTENT="en-US"/>		
	<link href="images/fav.png" type="image/png" rel="icon">
	<link href="css/main.css" rel="stylesheet" type="text/css" />
	<link href="css/smoothness/jquery-ui-1.8.4.custom.css" rel="stylesheet" type="text/css"/>	
	
	<script src="javascript/main.js" type="text/javascript" language="javascript"></script>
	<script src="javascript/jquery-1.4.2.js" type="text/javascript" language="javascript"></script>
	<script src="javascript/jquery-ui-1.8.4.custom.min.js" type="text/javascript" language="javascript"></script>
	<script>
		var path="/";
		$(document).ready(function(){
			$("#file").click(function(e){
				path="/";
				loadData();
				e.preventDefault();
			});
			
			$("#upload").click(upload_file);
			$("#new-folder").click(create_folder);
			
			var p=getUrlVars()["path"];
			path=p==null?"/":p;
			loadData();
			$("#file-upload").hide();
			$("#create-folder-div").hide();
			createPopup($("#popup-div"),function(){		
				$(".popup").css("visibility","hidden");					
				if("file"==field_type){
					delete_file(field_value);
				}else if("folder"==field_type){
					delete_folder(field_value);
				}
			});
		});
		
		function loadData(){
				$.getJSON("/cgi-bin/cgi-get-file.cgi?" + path,{},function(data){
					if(data!=null){
						var server_path=data.path;
						form_server_path(server_path);
						$("#file-div").html("");
						$.each(data.items, function(i,item){
							if(item!=null){
								if(item.type=="file"){
									var anch="<a src=>";
									$("#file-div").append("<div  class='file-item'><a href='/cgi-bin/cgi-get-file.cgi?" + path + item.name + "' type=\"" + item.type + "\" name=\"" + item.name + "\" class='item'>" + item.name + "</a>"
									+ "<img src='images/down.png' class='menu-item' type='file' value='" + path + item.name + "'/>"  
									+ "<span>" + item.size + "</span><span>" + item['mime-type'] + "</span><span>" + item.date + "</span></div>");							
								}else{
									$("#file-div").append("<div  class='folder-item'><span name=\"" + item.name + "\" class='item'>" + item.name + "</span>" 
									+ "<img src='images/down.png' class='menu-item' type='folder' value='" + server_path + $(this).attr("name") + "'/>"  
									+ "<span>" + item.date + "</span></div>");							
								}
							}
						});				
						$(".item").click(function(){							
							if($(this).attr("type")=="file"){
								//download_file($(this).attr("name"));
								return;
							}else{
								path=server_path + $(this).attr("name") + "/";
							}
							loadData();
						});
						$(".menu-item").hover(function(){
							$(this).attr("src","images/down-active.gif");	
						},function(){
							$(this).attr("src","images/down.png");	
						});
						$(".menu-item").click(showPopup);
					}	
				});
		}
		
		function delete_file(file_name){
			var answer = confirm("Delete file:" + file_name);
			if (answer){
				$.ajax({url:"/cgi-bin/cgi-op.cgi?op=remove-file&file=" + file_name,
					success:function(data){
							loadData();
						}
					});						 						 		
			}
		}
		
		function delete_folder(folder_name){
			var answer = confirm("Remove folder:" + folder_name);
			if (answer){
				$.ajax({url:"/cgi-bin/cgi-op.cgi?op=remove-folder&folder=" + folder_name,
					success:function(data){
							loadData();
						}
					});						 						 		
			}
		}

		function create_folder(){
			$("#create-folder-div").show();
			$("#folder-name").val("");
			$("#create-folder-div").dialog({title:"Create New Folder", modal:true,width: 460,buttons: {
		 			"Create": function(){
						$.ajax({url:"/cgi-bin/cgi-op.cgi?op=create-folder&folder=" + path + $("#folder-name").val(),
							success:function(data){
									loadData();
								}
							});						 						 		
						$( this ).dialog( "close" );
					},
					 Cancel: function() {
						 $( this ).dialog( "close" );
					 }
				}
			});
			$(".ui-widget-overlay").click(function(){
				$("#file-upload").dialog("close");
			});			
		}
		
		function form_server_path(server_path){
			$("#server-path").html("");
			$("#server-path").append("<span class='path-item' value='/'>root/</span>");
			
			if(server_path.length==0) return;
			var arr=server_path.split("/");
			var str="/";			
			for(var i=0;i<arr.length;i++){
				if(arr[i]!="") {
					str+=arr[i] + "/";
					$("#server-path").append("<span class='path-item' value='" + str + "'>" + unescape(arr[i]) + "/</span>");
				}
			}
			$(".path-item").click(function(){
				path=$(this).attr("value");
				loadData();
			});
		}
		
		function upload_file(){
			$("#file-upload").html("");
			$("#file-upload").append(
			"<form action='/cgi-bin/cgi-upload-file.cgi' enctype='multipart/form-data' method='post' id='upload-form'>" 
			+ "Upload path : " + path + "<br>Select File : "
			+ "<input type='file' name='file' size='20'/><br>"
			+ "<input type='hidden' name='path' value='" + path + "' />"
			+ "</form>");			
			$("#file-upload").dialog({title:"File Upload", modal:true,width: 460,buttons: {
		 			"Upload": function(){ 
		 				$("#upload-form").submit();
			/*$.ajax({
				  url: "/cgi-bin/cgi-upload-file.cgi",
				  dataType: "text/html",
				  type: 'POST',
				  success: function(html){
				     alert("success");
				  },
				  error: function(xhr, error){
				  	alert("error");
				     console.debug(xhr); 
				     console.debug(error);
				  }
				});*/		 				
						$( this ).dialog( "close" );
					},
					 Cancel: function() {
						 $( this ).dialog( "close" );
					 }
				}
			});
			$(".ui-widget-overlay").click(function(){
				$("#file-upload").dialog("close");
			});			
		}
		
		function download_file(file_path){
			var dp=path + file_path;
			
			/*alert(file_path);
			$("#file-form").attr("action","/cgi-bin/cgi-get-file.cgi?" + file_path);
			$("#file-form").submit();*/
			
			/*$(document).find("iframe").remove();
	      	var iframe = document.createElement("iframe");
	      	iframe.src = "/cgi-bin/cgi-get-file.cgi?" + file_path;	 
	      	iframe.style.display = "none";	 
	      	document.body.appendChild(iframe);*/
			window.location.href = "/cgi-bin/cgi-get-file.cgi?" + dp;
		return;
			$.ajax({
				  url: "/cgi-bin/cgi-get-file.cgi?" + file_path,
				  type: "POST",		
				  contentType: "application/json",				  
				  success: function(){
				  },
				  error: function(xhr, error){
				  	alert("error");
				     console.debug(xhr); 
				     console.debug(error);
				  }
			});
		}
	</script>
</header>
<body>
<div id="head-bar">
<form id="file-form" action="" method="GET" >
	<input type="hidden" name="test"/>
</form>
<table>
	<tr><td>
	<a href="/home.html">
		<img class="banner" src="/images/cloud.png" alt="Light Cloud">
	</a>
	</td>
	<td>
	<a href="/home.html" class="banner-label">
		<span >Light Cloud</span>
	</a>
	</td>
	</tr>
</table>
</div>
<div id="navigation">
 	<div class="inner">
	  	<ul>
		<li id="tabPhilosophy"><a href="/home.html">Home</a></li>
	   	<li id="tabLicenses"><a href="/index.html" id="file">Files</a></li>
	   	<li id="tabDoc"><a href="/doc.html" >Documentation</a></li>
	  </ul>
	</div>
</div>    
<div id="tool-bar">
	<table><tr>
		<td class="link-item"><img src="images/upload.png" title="Upload File" id="upload"/></td><td class="link-item" class="upload">File Upload</td>
		<td class="link-item"><img src="images/new_folder.png" title="Create New Folder" id="new-folder"/></td><td class="link-item" id="create-new-foler">Create New Folder</td>
	</tr>
	</table>
	<table>
	<tr>
		<td>Path:</td><td id="server-path"></td>
	</tr>
	</table>
</div>
<div id="path">
	
</div>

<div id="file-div">
</div>
<div id="file-upload">
</div>
<div id="create-folder-div">
	Folder Name : <input type='input' id='folder-name' size='20'/><br>
</div>
<div id="popup-div"></div>
</body>
</html>